<%@ page contentType="text/html;charset=utf-8" pageEncoding="UTF-8"%>
<%@include file="/common/common.jsp" %>

<html>
	<head>
		<title>杰马逊黄页后台管理_会员类别列表</title>		
		<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/skin.css">
		<link href="${pageContext.request.contextPath}/css/jquery.alerts.css" rel="stylesheet" type="text/css" media="screen">		
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery/jquery-1.4.2.min.js"></script>
		<script src="${pageContext.request.contextPath}/js/jquery/jquery.ui.draggable.js" type="text/javascript"></script>
		<script src="${pageContext.request.contextPath}/js/jquery/jquery.alerts.js" type="text/javascript"></script>
		<script src="${pageContext.request.contextPath}/js/tools.js" type="text/javascript"></script>		
		<style type="text/css">
			<!--
			body {
				margin-left: 0px;
				margin-top: 0px;
				margin-right: 0px;
				margin-bottom: 0px;
			}
			.STYLE1 {font-size: 12px}
			.STYLE3 {font-size: 12px; font-weight: bold; }
			.STYLE4 {
				color: #03515d;
				font-size: 12px;
			}
			
			a img{border:none;
				 vertical-align:bottom;
			}
			-->
		</style>
		<script type="text/javascript">
			function onAdd(){
				location.href = "${pageContext.request.contextPath}/admin/member/initAddCategory.action";
			}

			//分页按钮对象
			var homePage, prevPage, nextPage, lastPage, goPage, go;
			var checkBoxValues = "";
			
			/**
				初始化界面无素
			*/
			function init(){
				document.getElementById("recordTotal").innerHTML = "0";
				document.getElementById("pageTotal").innerHTML = "0";
				document.getElementById("nowPage").innerHTML = "0";
		
				homePage = document.getElementById("homePage");
				prevPage = document.getElementById("prevPage");
				nextPage = document.getElementById("nextPage");
				lastPage = document.getElementById("lastPage");
				goPage = document.getElementById("goPage");
				go = document.getElementById("go");	
		
				setPagingImgState(0, 0);
			}

			/**
			设置分页按钮图标点击状态
			*/	
			function setPagingImgState(nowPage, pageTotal){
				if(nowPage == 0 || (nowPage == 1 && pageTotal <= 1)){
					//所有按钮均不能点击
					setState(homePage, true);
					setState(prevPage, true);
					setState(nextPage, true);
					setState(lastPage, true);
					goPage.readOnly = true;
					setState(go, true);
				}else{
					if(nowPage == 1){
						setState(homePage, true);
						setState(prevPage, true);
						setState(nextPage, false);
						setState(lastPage, false);
						goPage.readOnly = false;
						setState(go, false);
					}else if(nowPage < pageTotal){
						setState(homePage, false);
						setState(prevPage, false);
						setState(nextPage, false);
						setState(lastPage, false);
						goPage.readOnly = false;
						setState(go, false);
					}else if(nowPage >= pageTotal){
						setState(homePage, false);
						setState(prevPage, false);
						setState(nextPage, true);
						setState(lastPage, true);
						goPage.readOnly = false;
						setState(go, false);
					}
				}
			}

			function setState(obj, flag){
				if(flag){
					obj.disabled = true;					   
					obj.style.filter = "gray";
					obj.style.cursor = "default";				
				}else{
					obj.disabled = false;
					obj.style.filter = "";
					obj.style.cursor = "hand";
				}
			}

			/**按条件查询*/
			function onQuery(pagesFlag){
				var pages = parseInt(document.getElementById("nowPage").innerHTML);
				
				switch(pagesFlag){
					//表示查询第一页或者是首询
					case 1 :  pages = 1;
							  break;
					 //表示查询上一页	
					case 2 : pages -= 1;
							 break;
					//表示下一页
					case 3: pages += 1;
					        break;
					//表示查询最后一页
					case 4: pages = parseInt(document.getElementById("pageTotal").innerHTML);
					        break;
					//表示跳转页
					case 5:
						if(goPage.value.trim() == ""){
							jAlert('warning', '请输入跳转的页!', '操作警告');
							goPage.focus();
							return false;
						}else{
							pages = goPage.value;
							if(pages > parseInt(document.getElementById("pageTotal").innerHTML)){
								jAlert('warning', '跳转页超过最大页数!', '操作警告');
								goPage.focus();
								return false;
							}
							break;
						}
				}

				document.getElementById("checkList").checked = false;
				document.getElementById("checkAll").checked = false;
				
				//验证条件
				if(categoryForm.queryName.value.trim() != ""){
					if(!checkedTextArea(categoryForm.queryName.value.trim(), 50, "会员类别名称")){
						categoryForm.queryName.focus();
						return false;
					}
				}
				
				var url = "queryCategory.action";

				var params = {
						nowPage:pages,
						queryName:$('#queryName').val()
				}; 

				$.post(url, params, callback, "json");
			}

			function callback(data){
				//show 页码
				document.getElementById("recordTotal").innerHTML = data.total;
				document.getElementById("pageTotal").innerHTML = data.pageTotal;
				document.getElementById("nowPage").innerHTML = data.nowPage;

				setPagingImgState(data.nowPage, data.pageTotal);

				var eTable = document.getElementById("eTable");
				//判断将原来表格
				deleteTableRow(eTable);
				
				//show 显示列表
				if(eval(data.rows).length == 0){
					//输出无记录
					var tb = eTable.insertRow().insertCell();
					
					tb.height = "20";
					tb.bgColor="#FFFFFF";
					tb.colSpan = "3";
					tb.innerHTML = "<div align='center'><span class='STYLE1'>无相关纪录" +
											"<span/></div>";				
				}else{
					//显示员工信息列表
					showTableRows(eTable, data.rows);
				}
			}

			/**
				显示表格
				参数说明：data为JSON数组
			*/
			function showTableRows(eTable, data){
				for(var i=0; i<data.length; i++){
					var tr = eTable.insertRow();

					//设置样式 
					//1显示多选框
					var tb0 = tr.insertCell();
					tb0.height = "20";
					tb0.bgColor="#FFFFFF";					
					tb0.innerHTML = "<div align='center'><input type='checkbox' name='checkboxs' " + 
									"value=" + data[i].SERIALID + " onclick='setCheckValues()'/></div>";

					//2显示类别名称
					var tb1 = tr.insertCell();
					tb1.height = "20";
					tb1.bgColor="#FFFFFF";
					tb1.innerHTML = "<div align='center'><span class='STYLE1'>" +  data[i].NAME +
									"<span/></div>";

					//4显示操作状态
					var tb2 = tr.insertCell();
					tb2.height = "20";
					tb2.bgColor="#FFFFFF";
					tb2.innerHTML = "<div align='center'><span class='STYLE4'>" + 
									"<a href='javascript:onDetail(" + data[i].SERIALID + ")'><img src='${pageContext.request.contextPath}/admin/images/main/detail.gif' width='16' " +
									"height='16'/>详情</a>&nbsp; &nbsp;<a href='javascript:onUpdate(" + data[i].SERIALID + ")'><img src='${pageContext.request.contextPath}/admin/images/main/edt.gif' width='16' " +
									"height='16'/>编辑</a>&nbsp; &nbsp;<a href='javascript:onDel(" + data[i].SERIALID + ")'><img src='${pageContext.request.contextPath}/admin/images/main/del.gif' " +
									"width='16' height='16' />删除</a></span></div>";
				}				
			}

			/**
				删除表格（保留表头一行）
			*/
			function deleteTableRow(eTable){
				//删除原有的
				var tableLen = eTable.rows.length;
				if(tableLen > 1){
					for(var i = tableLen - 1; i > 0; i--){
						eTable.deleteRow(i); 
					}
				}
			}

			function onChecked(chx){
				var boxName = chx.name;
				boxName = boxName == "checkList"?"checkAll":"checkList";

				//表示选中，变为不选中
				if(chx.checked){
					document.getElementById(boxName).checked = true;
					subCheckBoxChecked(true);
				}else{   //表示未选中，变为选中
					document.getElementById(boxName).checked = false;
					subCheckBoxChecked(false);
				}
			}

			/**
				isChecked= true表示选中，false表示不选中
			*/
			function subCheckBoxChecked(isChecked){
				var isFlag = (typeof(categoryForm.checkboxs) == 'undefined'); //如果为true, 表示只有一条记录
				
				if(!isFlag){
					if(typeof(categoryForm.checkboxs.length) == 'undefined'){
						if(isChecked){	
							categoryForm.checkboxs.checked = true;
							checkBoxValues = categoryForm.checkboxs.value;
						}else{
							categoryForm.checkboxs.checked = false;
						}									
					}else{
						for(var i = 0; i < categoryForm.checkboxs.length; i++){
							if(isChecked){
								categoryForm.checkboxs[i].checked = true;
								
								checkBoxValues = checkBoxValues + ";" + categoryForm.checkboxs[i].value; 
							}else
								categoryForm.checkboxs[i].checked = false;
						}
					}

					if(!isChecked)
						checkBoxValues = "";
				}
			}

			function setCheckValues(){
				checkBoxValues = "";
				if(typeof(categoryForm.checkboxs.length) == 'undefined'){
					if(categoryForm.checkboxs.checked)
						checkBoxValues = categoryForm.checkboxs.value;					
				}else{
					for(var i = 0; i < categoryForm.checkboxs.length; i++){
						if(categoryForm.checkboxs[i].checked){
							checkBoxValues = checkBoxValues + ";" + categoryForm.checkboxs[i].value; 
						}
					}
				}
			}

			function onDetail(categoryId){
				location.href = "${pageContext.request.contextPath}/admin/member/detailCategory.action?serialid=" + categoryId;
			}

			function onUpdate(categoryId){
				location.href = "${pageContext.request.contextPath}/admin/member/initUpdateCategory.action?serialid=" + categoryId;
			}

			/*
				删除 		
			*/
			function onDel(eId){		
				if(eId == ""){
					if(checkBoxValues == ""){						
						jAlert('warning', '请选择删除的记录!', '操作警告');
						return;
					}else{						
						if(checkBoxValues.indexOf(";") == 0){
							checkBoxValues = checkBoxValues.substring(1, checkBoxValues.length);
						}
						eId = checkBoxValues;
					}
				}
	
				//alert(eId);
				
				jConfirm('确定删除会员类别信息吗?', '操作确认', function(r) {
					if(r){
						var params = {
								serialid:eId
						}; 
	
						$.post("deleteCategory.action", params, delHandler, "json");
					}
	            });
			}
	
			function delHandler(data){
				if(data == "success"){					
					onQuery(0); //重新加载该页
					jAlert('success', '删除会员类别成功!', '操作提示');
				}else
					jAlert('error', data, '操作提示');	
			}
		</script>
	</head>
	
	<body onload="init()">
		<s:form name="categoryForm" id="categoryForm" method="post">
		<table width="100%" border="0" cellspacing="0" cellpadding="0">
			<tr>
				<td height="30" background="${pageContext.request.contextPath}/admin/images/main/tab_05.gif">
					<!-- 导航条 -->
					<table width="100%" border="0" cellspacing="0" cellpadding="0">
			      		<tr>
			        		<td width="12" height="30"><img src="${pageContext.request.contextPath}/admin/images/main/left-top-right.gif" width="12" height="30" /></td>
			       			<td>
			       				<table width="100%" border="0" cellspacing="0" cellpadding="0">
			          				<tr>
			            				<td width="46%" valign="middle">
			            					<table width="100%" border="0" cellspacing="0" cellpadding="0">
			              						<tr>
			                						<td width="5%"><div align="center"><img src="${pageContext.request.contextPath}/admin/images/main/tb.gif" width="16" height="16" /></div></td>
			                						<td width="95%" class="STYLE1"><span class="STYLE3">你当前的位置</span>：[会员管理]-[会员类别]-[会员类别列表]</td>
			              						</tr>
			            					</table>
			            				</td>
			            				<!--操作栏 -->
			            				<td width="54%">
			            					<table border="0" align="right" cellpadding="0" cellspacing="0">
			              						<tr>
			                						<td width="60">
			                							<table width="87%" border="0" cellpadding="0" cellspacing="0">
			                  								<tr>
			                    								<td class="STYLE1">
			                    									<div align="center"><input type="checkbox" name="checkAll" value="checkbox" id="checkAll" onclick="onChecked(this)"/></div>
			                    								</td>
			                    								<td class="STYLE1"><div align="center">全选</div></td>
			                  								</tr>
			                							</table>
			                						</td>
			                						
			                						
			                						<td width="60">
			                									                							
				                						 <table width="90%" border="0" cellpadding="0" cellspacing="0">
				                  							<tr>
				                   								<td class="STYLE1">
				                   								
				                   								<div align="center">
				                   								<a href="javascript:onAdd()">                    
				                    								<img src="${pageContext.request.contextPath}/admin/images/main/22.gif" width="14" height="14" />
				  												新增</a></div>
				  												
				  												</td>				  												           
				                 	 						</tr>
				                						</table>				                						
				                						
			                						</td>			                						
			               
			                						<td width="52">
			                							<table width="88%" border="0" cellpadding="0" cellspacing="0">
			                  								<tr>
			                    								<td class="STYLE1"><div align="center">
				                    								<a href="javascript:onDel('')">
				                    									<img src="${pageContext.request.contextPath}/admin/images/main/11.gif" width="14" height="14" />
				                    								删除</a></div>
			                    								</td>
			                  								</tr>
			                							</table>
			                						</td>
			              						</tr>
			            					</table>
			            				</td>
			          				</tr>
			        			</table>
			        		</td>
			        		<td width="16"><img src="${pageContext.request.contextPath}/admin/images/main/nav-right-bg.gif" width="16" height="30" /></td>
			      		</tr>
			    	</table>
			    </td>
			  </tr>
			  
			  <tr>
			    <td><table width="100%" border="0" cellspacing="0" cellpadding="0">
			      <tr>
			        <td width="8" background="${pageContext.request.contextPath}/admin/images/main/tab_12.gif">&nbsp;</td>
			        <td>
			        	<table width="100%" >
				        	<tr>
				        		<td>
				        			<!-- 查询条件 -->
					        		<table width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="b5d6e6">
							      		<tr>						        		
							  	  	 		<td>
							  	  	 			<table width="100%"  border="0"  cellpadding="0" cellspacing="1">
				              						<tr>
				                						<td height="26" class="searchTd">&nbsp;&nbsp;<img src="${pageContext.request.contextPath}/admin/images/Item.Search.gif">&nbsp;&nbsp; 查询条件</td>
				              						</tr>
				              						<tr>
				              							<td height="60" width="100%" bgcolor="#FFFFFF" class="left_txt2">
				              								&nbsp;
				              								类别名称：<input type="text" name="queryName" id="queryName" /> 
				              								<br />
				              								<div align="right">
				              									<input type="button" name="sb1" value="查询" onclick="onQuery(1)"/> &nbsp;&nbsp;
				              									<input type="button" name="sb1" value="清空" onclick="onReset()" />
				              									&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
				              								</div>			              								 
				              							</td>
				              						</tr>
				            		 			</table>				            		 			
				            	 			</td>
				            	 		</tr>			            	 		
				            	 	</table>
				            	</td>
				        	</tr>			        	
			        	
			        		<tr>
			        			<td>
			        				<table width="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="b5d6e6" id="eTable" >       	
							        	<tr>
			            					<td width="3%" height="22" background="${pageContext.request.contextPath}/admin/images/main/bg.gif" bgcolor="#FFFFFF"><div align="center">
			            						<input type="checkbox" name="checkList" value="checkbox" id="checkList" onclick="onChecked(this)"/>
			            					</div></td>
			            					<td width="16%" height="22" background="${pageContext.request.contextPath}/admin/images/main/bg.gif" bgcolor="#FFFFFF"><div align="center"><span class="STYLE1">类别名称</span></div></td>
			            					<td width="20%" height="22" background="${pageContext.request.contextPath}/admin/images/main/bg.gif" bgcolor="#FFFFFF" class="STYLE1"><div align="center">基本操作</div></td>
			          					</tr>
			        				</table>
			        			</td>
			        		</tr>
			        	</table>
			        </td>
			        <td width="8" background="${pageContext.request.contextPath}/admin/images/main/tab_15.gif">&nbsp;</td>
			      </tr>
			    </table></td>
			  </tr>
			  <tr>
			    <td height="35" background="${pageContext.request.contextPath}/admin/images/main/tab_19.gif"><table width="100%" border="0" cellspacing="0" cellpadding="0">
			      <tr>
			        <td width="12" height="35"><img src="${pageContext.request.contextPath}/admin/images/main/tab_18.gif" width="12" height="35" /></td>
			        <td><table width="100%" border="0" cellspacing="0" cellpadding="0">
			          <tr>
			            <td class="STYLE4">&nbsp;&nbsp;共有&nbsp;<span id="recordTotal"></span>&nbsp;条记录，当前第 &nbsp;<span id="nowPage"></span>&nbsp;/&nbsp;<span id="pageTotal"></span>&nbsp;页</td>
			            <td><table border="0" align="right" cellpadding="0" cellspacing="0">
			                <tr>
			                  <td width="40"><img src="${pageContext.request.contextPath}/admin/images/main/first.gif" width="37" height="15" id="homePage" onclick="onQuery(1)"/></td>
			                  <td width="45"><img src="${pageContext.request.contextPath}/admin/images/main/back.gif" width="43" height="15" id="prevPage" onclick="onQuery(2)"/></td>
			                  <td width="45"><img src="${pageContext.request.contextPath}/admin/images/main/next.gif" width="43" height="15" id="nextPage" onclick="onQuery(3)"/></td>
			                  <td width="40"><img src="${pageContext.request.contextPath}/admin/images/main/last.gif" width="37" height="15" id="lastPage" onclick="onQuery(4)"/></td>
			                  <td width="100"><div align="center"><span class="STYLE1">转到第
			                    <input name="goPage" id="goPage" type="text" maxlength="10" style="height:20px; width:40px; border:1px solid #999999;" onkeyup="value=value.replace(/[^\d]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))" />
			                    页 </span></div></td>
			                  <td width="40"><img src="${pageContext.request.contextPath}/admin/images/main/go.gif" width="37" height="15" id="go" onclick="onQuery(5)"/></td>
			                </tr>
			            </table></td>
			          </tr>
			        </table></td>
			        <td width="16"><img src="${pageContext.request.contextPath}/admin/images/main/tab_20.gif" width="16" height="35" /></td>
			      </tr>
			    </table></td>
			  </tr>
			</table>
		</s:form>
	</body>
</html>